<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/main.css" />
    <style type="text/css">
        body {
            background: rgba(190,190,190, 0.3);
        }
        .big-box {
            background: #fff;
            border-radius: 20px;
            width: 223px;
            height: 215px;
            position: absolute;
            left: 50%;
            top: 42%;
            transform: translate(-50%, -50%);
            padding-top: 15px;
        }
    </style>
</head>

<body>
    <div class="big-box" id="vm" v-cloak>
      <div style="text-align:center;color:#8F8F8F;font-size:16px">购买视频</div>
      <div style="font-size:13px;padding-left:30px;padding-top:13px">价格：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>{{videocash}}元</span></div>
      <div style="font-size:13px;padding-left:30px;padding-top:12px">观看有效期至{{showriqi(riqi)}}</div>
      <div style="font-size:13px;padding-left:30px;padding-top:13px;padding-bottom:12px;">官方有权调整影片内容</div>
      <div style="font-size:13px;border-top:1px solid #8F8F8F;color:#ED7C4C;text-align:center;height:30px;line-height:30px;" onclick="Buy()">购买</div>
      <div style="font-size:13px;border-top:1px solid #8F8F8F;color:#ED7C4C;text-align:center;height:30px;line-height:30px;"onclick="Opencancel()">取消</div>
    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/zepto.js"></script>
<script type="text/javascript" src="../../script/vue.2.5.js"></script>
<script type="text/javascript" src="../../script/faskclick.js"></script>
<script type="text/javascript">
var uid= $api.getStorage('uid');

var vm = new Vue({
    el: '#vm',
    data: {
      videocash:'',
      videoid:'',
      riqi:''
    },
    created: function() {
        var _this = this;

        apiready = function() {
            _this.init();
            api.parseTapmode();
            if ('addEventListener' in document) {
                document.addEventListener('DOMContentLoaded', function() {
                    FastClick.attach(document.body);
                }, false);
            }

        }
    },
    methods: {
        init: function() {
            var _this = this;
            _this.videocash=api.pageParam.videocash;
            _this.videoid=api.pageParam.videoid;
            _this.riqi=api.pageParam.riqi.split(' ')[0];
        },
        showriqi(riqi){
          if(api.pageParam.isyongjiu==1){
            return '永久'
          }else{
            return riqi
          }
        }
    }
})

    function Opencancel() {
      if (api.pageParam.value==1) {
        api.sendEvent({
            name: 'playvideoad'
        });
      }else {
        api.sendEvent({
            name: 'bofang'
        });
      }
      setTimeout(function() {
        api.closeFrame();
      },200)
    }
    function Buy() {
      if(uid){
        if(vm.videocash==0){
          api.toast({
              msg: '视频价格为0元',
              duration: 2000,
              location: 'bottom'
          });

        }else{
          api.openFrame({
              name: 'wechatpay',
              url: '../wechatpay.html',
              rect: {
                x: 0,
                y: 0,
                w: 'auto',
                h: 'auto'
              },
              pageParam: {
                  videocash: vm.videocash,
                  videoid:vm.videoid,
                  value:api.pageParam.value
              },
              bounces: false,
              bgColor: 'rgba(0,0,0,0)',
              vScrollBarEnabled: true,
              hScrollBarEnabled: true
          });
        }

      }else{
        api.openFrame({
            name: 'login_introduction',
            url: '../myself/login_introduction.html',
            rect: {
                x: 0,
                y: 0,
                w: 'auto',
                h: 'auto'
            },
            pageParam: {
                value:api.pageParam.value
            },
            bounces: false,
            bgColor: 'rgba(0,0,0,0.7)',
            vScrollBarEnabled: true,
            hScrollBarEnabled: true
        });
      }



      setTimeout(function() {
        api.closeFrame();
      }, 200)

    }
</script>

</html>
